<template>
  <div class="JS_container">
    <Card class="relative">
      <div class="searchTmInput">
        <Input
          search
          enter-button="立即查询"
          autofocus
          v-model="query_key"
          ref="oop"
          size="large"
          @on-search="searchTms"
          :placeholder="placeholder"
          @on-blur="reg_people_show=false"
          @keyup.native.38="selectItem(-1)"
          @keyup.native.40="selectItem(1)"
        >
          <!-- <Select v-model="cityName" slot="prepend" style="width: 80px">-->
          <!--   <Option value="中国">中国</Option>-->
          <!-- </Select>-->
        </Input>

        <SearchList
          v-show="reg_people_show || reg_people_show2"
          ref="scroll2"
          @mouseleave.native="reg_people_show2=false"
          @keyup.enter="onEnter"
          @select_name="getName"
          :reg_people_names="reg_people_names"
          :type="type"
          :itemNum="itemNum"
          :state="1"
          :category="0"
        ></SearchList>

      </div>
      <CustomBtn :type="type" @select_type="selectType" style="margin:20px 0;"></CustomBtn>


      <div v-show="!loading && $app.judgeData(list)">
        <div class="search-top">
          服务猫为您找到相关结果
          <i>{{total}}</i> 个，当前第
          <i>{{page}}</i>页
        </div>
        <div class="list">
          <PatentCell v-for="(item,index) in list" :key="index" :item="item"></PatentCell>
        </div>
        <div class="marginT10">
          <Page
            :total="total>max_total?max_total:total"
            show-total
            show-sizer
            show-elevator
            size="small"
            :page-size="pageSize"
            :page-size-opts="$app.pageAll.pageSizeOpts"
            :current="page"
            @on-change="loadMore"
            @on-page-size-change="changePageSize"
          ></Page>
        </div>
      </div>


      <div class="f_24 lineH2 cCCC textLeft" v-show="!loading && !$app.judgeData(list)">暂无结果</div>
      <div class="f_24 lineH2 cCCC textLeft" v-show="loading">正在加载...</div>
      
    </Card>
  </div>
</template>

<script>
import PatentCell from "../_currentTable/patentCell";
import CustomBtn from "../_currentTable/customBtn";
import SearchList from "../_currentTable/searchList";

export default {
  name: "patentList",
  components: {
    PatentCell,
    CustomBtn,
    SearchList
  },
  data() {
    let {
      $route: {
        query: { query_key, type }
      }
    } = this;
    let data = {
      type,
      placeholder: "",

      cityName: "中国",
      query_key, // 关键字名称
      list: [], // 集合
      itemNum: 0, // 选择
      reg_people_names: [], // 模糊搜索结果
      reg_people_show: false, //失去焦点
      reg_people_show2: false //移出界面
    };
    let tool = {
      loading: true, //正在加载中
      max_total: 0,
      total: 0,
      page: 1, // 当前页数
      pageSize: $app.pageAll.pageSize // 默认数据返回条数
    };
    return Object.assign(data, tool);
  },
  computed: {},
  // 挂载
  mounted() {
    this.getPtList();
  },
  // 绑定方法
  methods: {

    //判断输入框不能为空
    query_key_Had(callBack){
      let {
        query_key
      }=this;

      if($app.judgeData($app.delSpace(query_key))){
        callBack()
      }else{
        this.$Message.error({
          content:this.placeholder
        });
        this.$refs["oop"].focus();
        this.query_key='';
      }

    },
    // 搜索
    searchTms() {
      this.page = 1;
      let {
        type
      }=this;

      if (this.itemNum !== 0) {
        this.page = 1;
        this.reg_people_show = false;
        this.reg_people_show2 = false;
        this.query_key = this.reg_people_names[this.itemNum - 1];
        this.itemNum = 0;
        this.getPtList();
      } else {
        if (type == 3) {
          this.queryApplicantOne();
        } else if (type == 4) {
          this.queryAgent();
        } else if (type == 5) {
          this.queryAgentcy();
        } else {

          this.query_key_Had(()=>{
            this.getPtList();
          });

          
        }
      }
    },
    
    // 选择搜索类型
    selectType(data) {
      this.query_key = "";
      this.type = data.type;
      this.placeholder = data.placeholder;
    },
    // 加载更多
    loadMore(page) {
      this.page = page;
      this.getPtList();
    },
    // 数据返回条
    changePageSize(pageSize) {
      this.pageSize = pageSize;
      this.getPtList();
    },
    // 获取专利数据
    getPtList() {
      let {
        $route: {
          query: { 
            query_key, 
            type:typeT
          }
        }
      } = this;

      let {
        page, 
        pageSize, 
        type
      } = this;

      let query_go='';
      if(type==typeT && this.query_key==query_key){
        this.query_key=query_key;
        query_go=query_key;
      }else{
        query_go=this.query_key;
      }

      if(!$app.judgeData($app.delSpace(query_go))){
        this.query_key=query_key;
        query_go=query_key;
      }

      

      let objGo = {
        page,
        pageSize
      };

      switch (parseInt(type)) {
        case 1:
          objGo.patent_apply_number=query_go;
          break;
        case 2:
          objGo.patent_name=query_go;
          break;
        case 3:
          objGo.patent_applicant=query_go;
          break;
        case 4:
          objGo.agent=query_go;
          break;
        case 5:
          objGo.patent_agency=query_go;
          break;
      }

      this.list=[];
      this.loading=true;

      // 专利查询，5种类型都用一个API
      $ajax.lb_getPatentSearch(objGo, res => {
        this.loading=false;
        this.list = res.data.list;
        this.total = res.data.total;
        this.max_total = res.data.max_total;
        this.total_page = res.data.total_page;

        //替换地址栏
        this.$router.replace({
            name: 'patentList',
            query: {
                query_key:query_go,
                type
            }
        });
      });
    },
    // 上下选择
    selectItem(num) {
      let { itemNum, reg_people_names, scrollTop } = this;
      if (itemNum <= 0) {
        if (num > 0) {
          this.itemNum += num;
        } else {
          this.itemNum = 0;
        }
      } else if (itemNum >= reg_people_names.length && num > 0) {
        this.itemNum = reg_people_names.length;
      } else {
        this.itemNum += num;
      }
      console.log(this.itemNum);
    },
    // 模糊查询申请人
    queryApplicantOne() {
      
      this.query_key_Had(()=>{
        let{query_key:applicant_one}=this;
        $ajax.lb_queryApplicantOne({
          applicant_one
        }, resData => {
          this.reg_people_show = true;
          this.reg_people_show2 = true;
          this.reg_people_names = resData;
          this.itemNum = 0;
        },()=>{
          this.$refs["oop"].focus();
        });
      });
      
    },
    // 模糊查询代理人
    queryAgent() {
      this.query_key_Had(()=>{
        let{query_key:agent}=this;
        $ajax.lb_queryAgent({ agent }, resData => {
          this.reg_people_show = true;
          this.reg_people_show2 = true;
          this.reg_people_names = resData;
          this.itemNum = 0;
        },()=>{
          this.$refs["oop"].focus();
        });
      });
      
    },
    // 模糊查询代理机构
    queryAgentcy() {
      this.query_key_Had(()=>{
        let{query_key:agency}=this;
        $ajax.lb_queryAgent_cy({ agency }, resData => {
          this.reg_people_show = true;
          this.reg_people_show2 = true;
          this.reg_people_names = resData;
          this.itemNum = 0;
        },()=>{
          this.$refs["oop"].focus();
        });
      });
    },
    // 获取模糊查询的列表项
    getName(query_key) {
      this.query_key = query_key;
      console.log(query_key);
      this.page = 1;
      this.reg_people_show = false;
      this.reg_people_show2 = false;
      this.getPtList();
    }
  }
};
</script>
